<template>
    <div v-if="isshow == 1">
      <el-table :data="tableData" style="width: 100%" size="large" border :fit="true" row-class-name="row_name"  :header-cell-style="{
          textAlign: 'center',
          height: '42px',
          background: '#e9f2fa',
      }">
        <el-table-column prop="title" label="表单名称" align="center" />
        <el-table-column fixed="right" label="操作" align="center" width="300">
          <template #default="scope">
            <el-button  type="primary" size="small" @click="createbuild(scope.row.id)">编辑</el-button>
            <el-button  type="success" size="small" @click="see(scope.row.id)">预览</el-button>
          </template>
        </el-table-column>
      </el-table>
    </div>

    <div class="Cousee-bianji" v-if="isshow == 2">
      <div class="Coursee-goback" @click="goback()"></div>

      <div class="Invbuild">
        <div class="Invbuild-left">
            <div class="Invbuild-gcent">
              <div class="Build-box">
                <div class="Build-info">
                  <div class="Build-list">
                    <div class="Build-name">表单名称 *</div>
                    <el-input v-model="alldata.name" placeholder="请输入"></el-input>
                  </div>
                </div>
              </div>

            <div class="Build-box">
                <div class="Build-info">
                <div class="Build-name">表单问题</div>
                <div class="" v-if="synchright.length>0">
                    <div class="Build-quesbox" :class="avite == index?'Build-on':''" v-for="(item,index) in synchright" :key="index" @click="xuandiv(index)">
                      <div class="Build-treetop" v-if="index < 10">* 0{{ index+1 }}</div>
                      <div class="Build-treetop" v-if="index >= 10">* {{ index+1 }}</div>
                    <div class="Build-inright">
                        
                        <div class="Build-intitle">
                          <el-input v-model="item.name" placeholder="请输入问题(必填)"></el-input>
                        </div>
                        <div class="Build-incomp">
                        <QuillEditor  
                            class="editor"
                            v-model:content="item.content" 
                            ref="myTextEditor" 
                            :options="editorOption"
                            contentType="html"
                            @blur="onEditorBlur($event,index)" @focus="onEditorFocus($event)"
                            @selectionChange="onEditorChange($event,index)">
                        </QuillEditor>
                        <el-form ref="form" :model="form">
                            <el-form-item id="aetherupload-wrapper">
                              <input type="file" ref="uploadInput" @change="EditorUpload($event,index)" class="uploadImgEditor" id="aetherupload-resource">
                            </el-form-item>
                        </el-form>
                        </div>

                        <div class="" v-if="item.type == 2 || item.type == 3">
                        <div class="Build-xianx" v-for="(info, key) in item.option" :key="key">
                            <div class="Build-option">
                            <div class="Trainclass-zhanwei" v-if="key < 2"></div>
                            <div class="Trainclass-del" @click="delques(index,key)" v-if="key > 1"></div>
                            <el-input v-model="info.option_text" :placeholder="'选项'+(key+1)"></el-input>
                            </div>
                            <div class="Build-optguanl">逻辑关联:<span @click="asstck(item.type,index,key)">关联</span><b>{{info.son}}</b></div>
                        </div>
                        <div class="Createsub" @click="addoption(index)">
                            <span>添加选项</span>
                        </div>
                        </div>
                        <div class="Build-botom">
                        <div class="Build-botleft">
                            <div class="Build-gtixing" v-if="item.type == 1">问答</div>
                            <div class="Build-gtixing" v-if="item.type == 2">单选</div>
                            <div class="Build-gtixing" v-if="item.type == 3">多选</div>
                            <div class="Build-gtixing" v-if="item.type == 4">日期</div>
                            <div class="Build-gtixing" v-if="item.type == 5">时间</div>
                            <div class="Build-gtixing" v-if="item.type == 6">时长</div>
                            <div class="Build-gtixing" v-if="item.type == 7">图片</div>
                            <div class="Build-gtixing" v-if="item.type == 8">文件</div>
                            <div class="">
                            <el-checkbox v-model="item.is_must">必填</el-checkbox>
                            </div>
                            <div class="Build-guanl" v-if="item.type == 1 || item.type == 4 || item.type == 5 || item.type == 6 || item.type == 7 || item.type == 8">逻辑关联:<span @click="asstck(item.type,index,'')">关联</span><b>{{item.son}}</b></div>

                        </div>
                        <div class="querlist-pic">
                            <img src="../../../public/images/zhiding.png" title="置顶" @click="Ontop(index)">
                            <img src="../../../public/images/shangyi.png" title="上移" @click="Moveup(index)">
                            <img src="../../../public/images/xiayi.png" title="下移" @click="Movedown(index)">
                            <img src="../../../public/images/sckc.png" title="删除" @click="dellist(index)">
                        </div>
                        </div>
                    </div>
                    </div>
                </div>
                </div>
            </div>

            <div class="Build-box" v-if="'编辑时禁用'">
                <div class="Build-info">
                <div class="Build-list">
                    <div class="Build-name">状态</div>
                    <div class="Build-radio">
                    <el-radio v-model="alldata.status" :label="1" border>启用</el-radio>
                    <el-radio v-model="alldata.status" :label="2" border>禁用</el-radio>
                    </div>
                </div>
                </div>
            </div>

            <div class="Build-ok">
                <div class="Build-isbut" @click="confirm">发布</div>
            </div>

            </div>
            

            <div class="insertques">
                <div class="insertques-left">
                    <div class="insertques-title">插入问题：</div>
                    <div class="insertques-sp">
                        <span @click="addques('1')" class="inser-wd">问答</span>
                        <span @click="addques('2')" class="inser-danx">单选</span>
                        <span @click="addques('3')" class="inser-duox">多选</span>
                        <span @click="addques('4')" class="inser-rq">日期</span>
                        <span @click="addques('5')" class="inser-sj">时间</span>
                        <span @click="addques('6')" class="inser-sc">时长</span>
                        <span @click="addques('7')" class="inser-tp">图片</span>
                        <span @click="addques('8')" class="inser-wj">文件</span>
                    </div>
                </div>
            </div>
        </div>

        <div class="Invbuild-zhong"></div>

        <div class="Invbuild-right">
            <div class="">数据验证</div>
            <div class="Build-list" v-if="sztype == 1">
            <el-select placeholder="不限" v-model="synchright[avite].check_type" @change="wenda($event,avite)">
                <el-option key="1" label="无" :value="1"></el-option>
                <el-option key="2" label="字符个数" :value="2"></el-option>
                <el-option key="3" label="数字" :value="3"></el-option>
                <el-option key="4" label="手机号" :value="4"></el-option>
                <el-option key="5" label="身份证号" :value="5"></el-option>
                <el-option key="6" label="护照号" :value="6"></el-option>
                <el-option key="7" label="银行卡号" :value="7"></el-option>
                <el-option key="8" label="电子邮箱" :value="8"></el-option>
                <el-option key="9" label="固定电话" :value="9"></el-option>
                <el-option key="10" label="网址" :value="10"></el-option>
                <el-option key="11" label="货币" :value="11"></el-option>
            </el-select>

            <!-- 如果数据验证是字符个数 -->
            <div class="Build-mt20" v-if="synchright[avite].check_type == 2">
                <div class="Build-name">字符个数要求:</div>
                <el-select placeholder="不限" v-model="synchright[avite].check_string_length" @change="wderji($event,avite)">
                <el-option key="1" label="不限" :value="1"></el-option>
                <el-option key="2" label="不超过" :value="9"></el-option>
                <el-option key="3" label="不少于" :value="8"></el-option>
                </el-select>
                <div class="Build-ywz Build-mt20" v-if="synchright[avite].check_string_length == 9">不超过<input v-model="synchright[avite].check_string_end">个字符</div>
                <div class="Build-ywz Build-mt20" v-if="synchright[avite].check_string_length == 8">不少于<input v-model="synchright[avite].check_string_end">个字符</div>
                <div class="Build-zhuyi" v-if="synchright[avite].check_string_length == 8 || synchright[avite].check_string_length == 9">注：一个汉字需要两个字符，英文、数字需要1个字符！</div>
            </div>

            <!-- 如果数据验证是数字 -->
            <div class="Build-mt20" v-if="synchright[avite].check_type == 3">
                <div class="Build-name">数值单位:</div>
                <el-select placeholder="不限" v-model="synchright[avite].numb_unit" @change="wdnumber($event,avite)">
                <el-option key="1" label="无" value="null"></el-option>
                <el-option key="2" label="公斤" value="公斤"></el-option>
                <el-option key="3" label="厘米" value="厘米"></el-option>
                <el-option key="4" label="元/月" value="元/月"></el-option>
                <el-option key="5" label="℃" value="℃"></el-option>
                <el-option key="6" label="自定义" value="自定义"></el-option>
                </el-select>

                <div class="Build-guding Build-mt20" v-if="synchright[avite].numb_unit == '自定义'">
                <input placeholder="请输入" v-model="synchright[avite].check_unit">
                </div>


                <div class="Build-name Build-mt20">数值范围:</div>
                <el-select placeholder="不限" v-model="synchright[avite].check_number_length" @change="wdqingc()">
                <el-option key="1" label="不限" :value="1"></el-option>
                <el-option key="2" label="介于" :value="2"></el-option>
                <el-option key="3" label="不介于" :value="3"></el-option>
                <el-option key="4" label="不等于" :value="4"></el-option>
                <el-option key="5" label="大于" :value="6"></el-option>
                <el-option key="6" label="小于" :value="7"></el-option>
                <el-option key="7" label="大于或等于" :value="8"></el-option>
                <el-option key="8" label="小于或等于" :value="9"></el-option>
                </el-select>
                <div class="Build-jieyu Build-mt20" v-if="synchright[avite].check_number_length == 2 || synchright[avite].check_number_length == 3">
                <input placeholder="最小值" v-model="synchright[avite].check_number_begin">
                <span>和</span>
                <input placeholder="最大值" v-model="synchright[avite].check_number_end">
                </div>
                <div class="Build-guding Build-mt20" v-if="synchright[avite].check_number_length != 1 && synchright[avite].check_number_length != 2 && synchright[avite].check_number_length != 3">
                <input placeholder="请输入" v-model="synchright[avite].check_number_end">
                </div>

                <div class="Build-name Build-mt20">数值格式:</div>
                <el-select placeholder="不限" v-model="synchright[avite].check_number_type" @change="wdqingc()">
                <el-option key="1" label="整数/小数" :value="1"></el-option>
                <el-option key="2" label="整数" :value="2"></el-option>
                <el-option key="3" label="小数" :value="3"></el-option>
                </el-select>

                <div class="Build-name Build-mt20">字符个数:</div>
                <el-select placeholder="不限" v-model="synchright[avite].check_string_length" @change="wdqingc()">
                <el-option key="1" label="不限" :value="1"></el-option>
                <el-option key="2" label="不超过" :value="9"></el-option>
                <el-option key="3" label="不少于" :value="8"></el-option>
                </el-select>

                <div class="Build-ywz Build-mt20" v-if="synchright[avite].check_string_length == 9">不超过<input v-model="synchright[avite].check_string_end">个字符</div>
                <div class="Build-ywz Build-mt20" v-if="synchright[avite].check_string_length == 8">不少于<input v-model="synchright[avite].check_string_end">个字符</div>
                <div class="Build-zhuyi" v-if="synchright[avite].check_string_length == 8 || synchright[avite].check_string_length == 9">注：一个汉字需要两个字符，英文、数字需要1个字符！</div>
            </div>

            <!-- 如果数据验证是货币 -->
            <div class="Build-mt20" v-if="synchright[avite].check_type == 11">
                <div class="Build-name">小数位上限:</div>
                <div class="Build-guding Build-mt20">
                <input type="number" v-model="synchright[avite].decimal_end">
                </div>

                <div class="Build-name Build-mt20">数值范围:</div>
                <el-select placeholder="不限" v-model="synchright[avite].check_number_length" @change="wdqingc()">
                <el-option key="1" label="不限" :value="1"></el-option>
                <el-option key="2" label="介于" :value="2"></el-option>
                <el-option key="3" label="不介于" :value="3"></el-option>
                <el-option key="4" label="不等于" :value="4"></el-option>
                <el-option key="5" label="大于" :value="6"></el-option>
                <el-option key="6" label="小于" :value="7"></el-option>
                <el-option key="7" label="大于或等于" :value="8"></el-option>
                <el-option key="8" label="小于或等于" :value="9"></el-option>
                </el-select>
                <div class="Build-jieyu Build-mt20" v-if="synchright[avite].check_number_length == 2 || synchright[avite].check_number_length == 3">
                <input placeholder="最小值" v-model="synchright[avite].check_number_begin">
                <span>和</span>
                <input placeholder="最大值" v-model="synchright[avite].check_number_end">
                </div>
                <div class="Build-guding Build-mt20" v-if="synchright[avite].check_number_length != 1 && synchright[avite].check_number_length != 2 && synchright[avite].check_number_length != 3">
                <input placeholder="请输入" v-model="synchright[avite].check_number_end">
                </div>
            </div>
            </div>

            <div class="Build-list" v-if="sztype == 3">
            <div class="Build-name">限制:</div>
            <el-select placeholder="不限" v-model="synchright[avite].check_number_length" @change="duoxuan($event,avite)">
                <el-option key="1" label="不限制可选数量" :value="1"></el-option>
                <el-option key="2" label="至少选择" :value="8"></el-option>
                <el-option key="3" label="最多选择" :value="9"></el-option>
            </el-select>
            <div class="Build-ywz Build-mt20" v-if="synchright[avite].check_number_length ==8">至少选择<input v-model="synchright[avite].check_number_end">项</div>
            <div class="Build-ywz Build-mt20" v-if="synchright[avite].check_number_length ==9">最多选择<input v-model="synchright[avite].check_number_end">项</div>
            </div>

            <div class="Build-list" v-if="sztype == 4">
            <div class="Build-name">格式:</div>
            <el-select placeholder="不限" v-model="synchright[avite].check_date">
                <el-option key="1" label="年月日时分" :value="1"></el-option>
                <el-option key="2" label="年月日" :value="2"></el-option>
                <el-option key="3" label="年月" :value="3"></el-option>
                <el-option key="4" label="月日" :value="4"></el-option>
            </el-select>
            </div>

            <div class="Build-list" v-if="sztype == 5">
            <div class="Build-name">格式:</div>
            <el-select placeholder="不限" v-model="synchright[avite].check_date">
                <el-option key="1" label="时分秒" :value="5"></el-option>
                <el-option key="2" label="时分" :value="6"></el-option>
            </el-select>
            </div>

            <div class="Build-list" v-if="sztype == 6">
            <div class="Build-name">格式:</div>
            <el-select placeholder="不限" v-model="synchright[avite].check_date">
                <el-option key="1" label="时分秒" :value="5"></el-option>
                <el-option key="2" label="时分" :value="6"></el-option>
                <el-option key="3" label="分秒" :value="7"></el-option>
                <el-option key="4" label="秒" :value="8"></el-option>
            </el-select>
            </div>

            <div class="Build-list Build-fen" v-if="sztype == 7">
            <div class="">
                <div class="Build-name">命名方式</div>
                <div class="Build-guding">昵称_提交时间_文件原名_编号</div>
            </div>
            <div class="Build-mt20">
                <div class="Build-name">图片数量:</div>
                <el-select placeholder="不限" v-model="synchright[avite].check_number_length">
                <el-option key="1" label="最多数量" :value="9"></el-option>
                <el-option key="2" label="最少数量" :value="8"></el-option>
                <el-option key="3" label="固定数量" :value="5"></el-option>
                </el-select>
                <div class="Build-ywz Build-mt20" v-if="synchright[avite].check_number_length ==9">最多上传<input v-model="synchright[avite].check_number_end">张图</div>
                <div class="Build-ywz Build-mt20" v-if="synchright[avite].check_number_length ==8">最少上传<input v-model="synchright[avite].check_number_end">张图</div>
                <div class="Build-ywz Build-mt20" v-if="synchright[avite].check_number_length ==5">固定上传<input v-model="synchright[avite].check_number_end">张图</div>
            </div>
            <div class="Build-mt20">
                <div class="Build-name">大小限制:</div> 
                <div class="Build-ywz">小于等于<input placeholder="输入0.1-20的数值" v-model="synchright[avite].file_end">MB</div>
            </div>
            </div>

            <div class="Build-list" v-if="sztype == 8">
            <div class="">
                <div class="Build-name">命名方式:</div>
                <div class="Build-guding">昵称_提交时间_文件原名_编号</div>
            </div>

            <div class="Build-mt20">
                <div class="Build-name">文件类型:</div>
                <el-select placeholder="不限" v-model="synchright[avite].check_file_type">
                <el-option key="1" label="无" :value="1"></el-option>
                <el-option key="2" label="文档(docx/doc/txt)" :value="2"></el-option>
                <el-option key="3" label="表格(xlsx/xls/csv)" :value="3"></el-option>
                <el-option key="4" label="PPT" :value="4"></el-option>
                <el-option key="5" label="PDF" :value="5"></el-option>
                <el-option key="6" label="视频(mp4/mov/wmv)" :value="6"></el-option>
                <el-option key="7" label="音频(mp3/flac/aac)" :value="7"></el-option>
                <el-option key="8" label="图片(png/jpg/gif)" :value="8"></el-option>
                </el-select>
            </div>

            <div class="Build-mt20">
                <div class="Build-name">大小限制:</div>
                <div class="Build-ywz">小于等于<input v-model="synchright[avite].file_end" placeholder="请输入0.1-300的数值">MB</div>
            </div>
            
            </div>
        </div>
      </div>

      <!-- 关联题目 -->
      <div class="examine-mark" v-if="assrebut"></div>
      <div class="operate-tck" v-if="assrebut">
        <div class="operate-box">
          <div class="operate-top">
            <div class="operate-logo">
              <img src="../../../public/images/peixunhong.png">
            </div>
            <div class="newgl-czwc">关联题目</div>
          </div>

          <div class="operate-zhong">
            <el-table
              ref="multipleTable"
              :data="synchright.filter((item, index) => index > glind)"
              style="width: 100%;"
              :header-cell-style="tableHeaderColor"
              :cell-style="{'text-align':'left'}"
              @selection-change="handleSelectionChange">
              <el-table-column
                type="selection"
                width="55">
              </el-table-column>
              <el-table-column
                label="题目序号"
                align="center"
                header-align="center">
                <template #default="scope">
                  <span>{{scope.$index+glind+2}}</span>
                </template>
              </el-table-column>
            </el-table>
          </div>

          <div class="newgl-but">
            <div class="newgl-close" @click="assmark">取消</div>
            <div class="newgl-xian"></div>
            <div class="newgl-gonin" @click="asspost">确认</div>
          </div>
        </div>
      </div>
    </div>

    <!-- 查看表单-->
    <div class="examine-mark" v-if="paperfor"></div>
    <div class="operate-tck" v-if="paperfor">
      <div class="Seerate-box">
        <div class="operate-top">
          <div class="operate-logo">
            <img src="../../../public/images/fbtzhong.png">
          </div>
          <div class="operate-czwc">表单信息</div>
        </div>
        
        <div class="Seecour-zhong">

          <div class="applyfor-illustrate">
            <p><span>状态：</span>{{ ques_data.show_status }}</p>
          </div>

          <div class="applyfor-illustrate"><span>表单名称：</span>{{ ques_data.name }}</div>

          <div class="applyfor-illustrate"><span>题数：</span>{{ ques_data.show_number }}</div>
          
          <div class="applyfor-questitle"><span>题目</span></div>

          <div class="">
            <div class="" v-for="(item,index) in ques_data.question_info" :label="index" :key="index">
              <div class="quertion-list" v-if="item.type == 1 || item.type == 4 || item.type == 5 || item.type == 6 || item.type == 7 || item.type == 8">
                <div class="querlist-left">
                  <div class="querlist-tep">{{ index + 1 }}</div>
                  <div class="querlist-name">{{ item.show_type }}</div>
                </div>
                <div class="querlist-right">
                  <div class="querlist-evetitle">{{ item.name }}</div>
                  <div class="querlist-naireask">
                    <p v-if="item.is_must == 1"><span>是否必填：</span>是</p>
                    <p v-if="item.is_must == 2"><span>是否必填：</span>否</p>
                    <p v-if="item.son.length > 0"><span>关联：</span>{{ item.son }}</p>
                  </div>

                  <div class="certifi-list" v-if="item.type == 1">
                    <div class="certifi-simtab">
                      <span>数据验证：</span>
                      <div class="certifi-info">
                        <b v-if="item.check_type == 1">无</b>
                        <b v-if="item.check_type == 2">字符个数</b>
                        <b v-if="item.check_type == 3">数字</b>
                        <b v-if="item.check_type == 4">手机号</b>
                        <b v-if="item.check_type == 5">身份证号</b>
                        <b v-if="item.check_type == 6">护照号</b>
                        <b v-if="item.check_type == 7">银行卡号</b>
                        <b v-if="item.check_type == 8">电子邮箱</b>
                        <b v-if="item.check_type == 9">固定电话</b>
                        <b v-if="item.check_type == 10">网址</b>
                        <b v-if="item.check_type == 11">货币</b>
                      </div>
                    </div>

                    <div class="certifi-simtab" v-if="item.check_type == 2">
                      <span>字符个数：</span>
                      <div class="certifi-info">
                        <b v-if="item.check_string_length == 1">不限</b>
                        <b v-if="item.check_string_length == 9">不超过 <i>{{item.check_string_end}}个字符</i></b>
                        <b v-if="item.check_string_length == 8">不少于 <i>{{item.check_string_end}}个字符</i></b>
                      </div>
                    </div>

                    <div class="certifi-simbox" v-if="item.check_type == 3">
                      <div class="certifi-simtab">
                        <span>单位：</span>
                        <div class="certifi-info">
                          <b>{{item.check_unit}}</b>
                        </div>
                      </div>

                      <div class="certifi-simtab">
                        <span>数值范围：</span>
                        <div class="certifi-info">
                          <b v-if="item.check_number_length == 1">不限</b>
                          <b v-if="item.check_number_length == 2">介于 <i>{{ item.check_number_begin }} 和 {{ item.check_number_end }} 之间</i></b>
                          <b v-if="item.check_number_length == 3">不介于 <i>{{ item.check_number_begin }} 和 {{ item.check_number_end }} 之间</i></b>
                          <b v-if="item.check_number_length == 4">不等于 <i>{{ item.check_number_end }}</i></b>
                          <b v-if="item.check_number_length == 5">大于 <i>{{ item.check_number_end }}</i></b>
                          <b v-if="item.check_number_length == 6">小于 <i>{{ item.check_number_end }}</i></b>
                          <b v-if="item.check_number_length == 7">大于或等于 <i>{{ item.check_number_end }}</i></b>
                          <b v-if="item.check_number_length == 8">小于或等于 <i>{{ item.check_number_end }}</i></b>
                        </div>
                      </div>

                      <div class="certifi-simtab">
                        <span>格式：</span>
                        <div class="certifi-info">
                          <b v-if="item.check_number_type == 1">整数/小数</b>
                          <b v-if="item.check_number_type == 2">整数</b>
                          <b v-if="item.check_number_type == 3">小数</b>
                        </div>
                      </div>
                      
                      <div class="certifi-simtab">
                        <span>字符个数：</span>
                        <div class="certifi-info">
                          <b v-if="item.check_string_length == 1">不限</b>
                          <b v-if="item.check_string_length == 9">不超过 <i>{{item.check_string_end}}个字符</i></b>
                          <b v-if="item.check_string_length == 8">不少于 <i>{{item.check_string_end}}个字符</i></b>
                        </div>
                      </div>
                    </div>

                    <div class="certifi-simbox" v-if="item.check_type == 11">
                      <div class="certifi-simtab">
                        <span>小数上限：</span>
                        <div class="certifi-info">
                          <b >{{item.decimal_end}}</b>
                        </div>
                      </div>

                      <div class="certifi-simtab">
                        <span>数值范围：</span>
                        <div class="certifi-info">
                          <b v-if="item.check_number_length == 1">不限</b>
                          <b v-if="item.check_number_length == 2">介于 <i>{{ item.check_number_begin }} 和 {{ item.check_number_end }} 之间</i></b>
                          <b v-if="item.check_number_length == 3">不介于 <i>{{ item.check_number_begin }} 和 {{ item.check_number_end }} 之间</i></b>
                          <b v-if="item.check_number_length == 4">不等于 <i>{{ item.check_number_end }}</i></b>
                          <b v-if="item.check_number_length == 5">大于 <i>{{ item.check_number_end }}</i></b>
                          <b v-if="item.check_number_length == 6">小于 <i>{{ item.check_number_end }}</i></b>
                          <b v-if="item.check_number_length == 7">大于或等于 <i>{{ item.check_number_end }}</i></b>
                          <b v-if="item.check_number_length == 8">小于或等于 <i>{{ item.check_number_end }}</i></b>
                        </div>
                      </div>
                    </div>
                  </div>

                  <div class="certifi-list" v-if="item.type == 4">
                    <div class="certifi-simtab">
                      <span>格式：</span>
                      <div class="certifi-info">
                        <b v-if="item.check_date == 1">年月日时分</b>
                        <b v-if="item.check_date == 2">年月日</b>
                        <b v-if="item.check_date == 3">年月</b>
                        <b v-if="item.check_date == 4">月日</b>
                      </div>
                    </div>
                  </div>

                  <div class="certifi-list" v-if="item.type == 5">
                    <div class="certifi-simtab">
                      <span>格式：</span>
                      <div class="certifi-info">
                        <b v-if="item.check_date == 5">时分秒</b>
                        <b v-if="item.check_date == 6">时分</b>
                      </div>
                    </div>
                  </div>

                  <div class="certifi-list" v-if="item.type == 6">
                    <div class="certifi-simtab">
                      <span>格式：</span>
                      <div class="certifi-info">
                        <b v-if="item.check_date == 5">时分秒</b>
                        <b v-if="item.check_date == 6">时分</b>
                        <b v-if="item.check_date == 7">分秒</b>
                        <b v-if="item.check_date == 8">秒</b>
                      </div>
                    </div>
                  </div>

                  <div class="certifi-list" v-if="item.type == 7">
                    <div class="certifi-simtab">
                      <span>图片数量:</span>
                      <div class="certifi-info">
                        <b v-if="item.check_number_length == 9">最多上传 <i>{{item.check_number_end}}张图</i></b>
                        <b v-if="item.check_number_length == 8">最少上传 <i>{{item.check_number_end}}张图</i></b>
                        <b v-if="item.check_number_length == 5">固定上传 <i>{{item.check_number_end}}张图</i></b>
                      </div>
                    </div>

                    <div class="certifi-simtab">
                      <span>大小限制:</span>
                      <div class="certifi-info">
                        <b>小于等于 <i>{{item.file_end}} MB</i></b>
                      </div>
                    </div>
                  </div>

                  <div class="certifi-list" v-if="item.type == 8">
                    <div class="certifi-simtab">
                      <span>文件类型:</span>
                      <div class="certifi-info">
                        <b v-if="item.check_file_type == 1">无</b>
                        <b v-if="item.check_file_type == 2">文档(docx/doc/txt)</b>
                        <b v-if="item.check_file_type == 3">表格(xlsx/xls/csv)</b>
                        <b v-if="item.check_file_type == 4">PPT</b>
                        <b v-if="item.check_file_type == 5">PDF</b>
                        <b v-if="item.check_file_type == 6">视频(mp4/mov/wmv)</b>
                        <b v-if="item.check_file_type == 7">音频(mp3/flac/aac)</b>
                        <b v-if="item.check_file_type == 8">图片(png/jpg/gif)</b>
                      </div>
                    </div>

                    <div class="certifi-simtab">
                      <span>大小限制:</span>
                      <div class="certifi-info">
                        <b>小于等于 <i>{{item.file_end}} MB</i></b>
                      </div>
                    </div>
                  </div>

                </div>
              </div>

              <div class="quertion-list" v-if="item.type == 2 || item.type == 3">
                <div class="querlist-left">
                  <div class="querlist-tep">{{ index + 1 }}</div>
                  <div class="querlist-name">{{ item.show_type }}</div>
                </div>
                <div class="querlist-right">
                  <div class="querlist-evetitle">{{ item.name }}</div>
                  <div class="querlist-radio">

                    <div class="querlist-probox" v-for="(val,k) in item.option" :label="k" :key="k">
                      <div class="querlist-simnew">
                        <div class="querlist-protitle"><span>选项 {{k+1}}、</span>{{ val.option_text }}</div>
                        <div v-if="val.son.length > 0"><span>关联：</span>{{ val.son }}</div>
                      </div>
                    </div>
                    
                    <div class="querlist-naireask">
                      <p v-if="item.is_must == 1"><span>是否必填：</span>是</p>
                      <p v-if="item.is_must == 2"><span>是否必填：</span>否</p>
                    </div>

                    <div class="certifi-list" v-if="item.type == 3">
                      <div class="certifi-simtab">
                        <span>限制：</span>
                        <div class="certifi-info">
                          <b v-if="item.check_number_length == 1">不限制可选数量</b>
                          <b v-if="item.check_number_length == 8">至少选择 <i>{{item.check_number_end}}项</i></b>
                          <b v-if="item.check_number_length == 9">最多选择 <i>{{item.check_number_end}}项</i></b>
                        </div>
                      </div>
                    </div>

                  </div>
                </div>
              </div>
            </div>
          </div>
        </div>

        <div class="Seecour-close" @click="quersout">关闭</div>
      </div>
    </div>

    
    

</template>

<script>
    import axios from 'axios'
    import { QuillEditor } from '@vueup/vue-quill';
    import '@vueup/vue-quill/dist/vue-quill.snow.css';
    import quillConfig from '../../utils/quill-config.js';
    import { update_img } from "@/request/api/system.ts";
    export default {
        components: {
          QuillEditor
        },
        data() {
            return {
                isshow: 1,
                tableData: [
                    {
                        id: 29,
                        title:'招聘表单'
                    },
                    {
                        id: 30,
                        title:'求职表单'
                    },
                    {
                        id: 31,
                        title:'购房表单'
                    },
                    {
                        id: 32,
                        title:'售房表单'
                    },
                    {
                        id: 33,
                        title:'出租表单'
                    },
                    {
                        id: 34,
                        title:'求租表单'
                    },
                    {
                        id: 35,
                        title:'出售表单'
                    },
                    {
                        id: 36,
                        title:'求购表单'
                    },
                    {
                        id: 37,
                        title:'转商表单'
                    },
                    {
                        id: 38,
                        title:'找商表单'
                    },
                    {
                        id: 39,
                        title:'售车表单'
                    },
                    {
                        id: 40,
                        title:'购车表单'
                    },
                    {
                        id: 41,
                        title:'人找车'
                    },
                    {
                        id: 42,
                        title:'车找人'
                    },
                    {
                        id: 43,
                        title:'打听事'
                    },
                    {
                        id: 44,
                        title:'寻人'
                    },
                    {
                        id: 45,
                        title:'找物'
                    },
                    {
                        id: 46,
                        title:'走失认领'
                    },
                    {
                        id: 47,
                        title:'丢失认领'
                    },
                    {
                        id: 48,
                        title:'征婚'
                    },
                ],
                token: localStorage.token,  //获取token
                staffList: [],              //左边题目数据
                selectedStaffList: [],      //右边题目数据
                form: {
                    photo_url:'',             //描述上传图片用
                },
            
                synchright:[],              //确认后插入题目列表
                rebut: false,               //所有题目弹框
                sztype:'null',              //选中题目的类别（图片，单选，多选等）
                avite:'null',               //选中的div下标（用于赋值数字验证和修改样式）
                assrebut: false,            //关联显示弹框
                glind:'',                   //点击关联选中的题目下标
                zancunindex:[],             //暂存关联的下标
                zancunnum:[],               //暂存关联的题目序号
                istyp: '',                  //暂存要关联题目的type
                iske: '',                   //暂存要关联题目选项的下标（type为2，3时用到）
                alldata:{
                    name: '',
                    que_type: 1,
                    question:[],
                    status: 1
                },
                paperfor: false,          //查看弹框是否显示
                editorOption: quillConfig,  //修改编辑器默认文本
            }
        },

        methods:{
            //返回按钮
            goback(){
              this.alldata = {
                name: '',
                que_type: 1,
                question:[],
                status: 1
              },
              this.isshow = 1;
            },

            //富文本上传图片
            async EditorUpload(e,index){
              let quill = this.$refs.myTextEditor[index].editor.__quill;  //获取富文本编辑器对象
              quill.focus();
              let fd = new FormData()
              fd.append("file", this.$refs.uploadInput[index].files[0])
              
              let data1 = await update_img(fd)
              let length = quill.getSelection().index;    //光标位置
              quill.insertEmbed(length,"image",import.meta.env.VITE_BASE_URL + "/" + data1.data.file,);      //插入图片
              quill.setSelection(length + 1);             //调整光标到最后
            },

            //点击查看表单详情
            see(id){
              axios.post('http://api.customer.form.bailingkeji.com/admin/investigate/show',{
                que_id: id
              },{
                headers: {
                  'Authorization': 'Bearer ' + this.token
                }
              }).then((res)=>{
                if(res.data.code == 0){
                  this.ques_data = res.data.data;
                  this.paperfor = true
                }else{
                  ElMessage({
                    message: res.data.msg,
                    type: 'error',
                  });
                }
              })
            },

            //表单信息弹框关闭
            quersout(){
              this.paperfor = false;
            },

            //点击编辑按钮
            createbuild(id){
              this.alldata.que_id = id;
              //获取表单详情
              axios.post('http://api.customer.form.bailingkeji.com/admin/investigate/show',{
                que_id: id
              },{
                headers: {
                    'Authorization': 'Bearer ' + this.token
                }
              }).then((res)=>{
                if(res.data.code == 0){
                  let info = res.data.data;
                  this.alldata.name = info.name;
                  this.alldata.status = info.status;
                  this.synchright = info.question_info;
                  for(var item of this.synchright){
                    if(item['is_must'] == 1){
                      item['is_must'] = true
                    }else{
                      item['is_must'] = false
                    }
                  }
                  this.isshow = 2;
                }else{
                  ElMessage({
                    message: res.data.msg,
                    type: 'error',
                  });
                }
              })

              this.editorOption = {
                placeholder: '请输入描述',
                theme: 'snow',  // 主题
                modules: {
                  toolbar: {
                    container: [ // 工具栏选项
                      ['image']
                    ],  
                    handlers: {
                      image: function(value) {
                        if(value){
                          document.querySelector(".uploadImgEditor").click()
                        }else{
                          this.quill.format("image",false)
                        }
                      }
                    }  // 事件重写
                  }
                }
              }
            },

            //选择div
            xuandiv(ind){
              this.avite = ind;
              this.sztype = this.synchright[ind].type;
            },


            //点击底部创建题目
            addques(te){
              let newcen = {
                name: '',               //题目标题
                content:'',                //问题描述
                type: te,               //判断是问答还是单选多选等
                is_must: true,          //是否必填  true必填  false不必填
                son:[],                 //题目关联的其他题目的序号（用于显示关联题序号）
                treetop:[],             //题目关联的其他题目的下标
                uid:'',
              };
              if(te == 1){
                newcen['check_type'] = 1
              }else if(te == 2){
                newcen['option'] = [
                  {
                    option_text:'',
                    son:[],
                    treetop:[],
                    option_img:[]
                  },
                  {
                    option_text:'',
                    son:[],
                    treetop:[],
                    option_img:[]
                  }
                ]
              }else if(te == 3){
                newcen['option'] = [
                  {
                    option_text:'',
                    son:[],
                    treetop:[],   
                    option_img:[] 
                  },
                  {
                    option_text:'',
                    son:[],
                    treetop:[],
                    option_img:[]
                  }
                ],
                newcen['check_number_length'] = 1;
              }else if(te == 4){
                newcen['check_date'] = 1;
              }else if(te == 5){
                newcen['check_date'] = 5;
              }else if(te == 6){
                newcen['check_date'] = 5;
              }else if(te == 7){
                newcen['check_number_length'] = 9;
                newcen['check_number_end'] = '1';
                newcen['file_end'] = '';
              }else if(te == 8){
                newcen['check_file_type'] = 1;
                newcen['file_end'] = '';
              }

              this.synchright.push(newcen)

              this.synchright.forEach((item, index) => {
                  item['uid'] = index+1;
              });
            },

            //点击增加选项
            addoption(key){
              this.synchright[key].option.push(
                {
                  option_text:'',
                  son:[],
                  treetop:[],
                  option_img:[]
                }
              )
            },

            //点击删除选项
            delques(ind,key){
              this.synchright[ind].option.splice(key,1)
            },

            //关联显示弹框
            asstck(type,index,key){
              this.glind = index;
              this.istyp = type;
              this.iske = key;
              let data = [];
              if(type == 1 || type == 4 || type == 5 || type == 6 || type == 7 || type == 8){
                this.synchright[index].treetop.forEach(item => {
                  data.push(this.synchright[item])
                });
                setTimeout(() => {
                  this.$nextTick(()=>{
                    data.forEach(row => {
                      this.$refs.multipleTable.toggleRowSelection(this.synchright.find(val => {
                      return row.uid == val.uid
                      }),true);
                    });
                  })
                }, 100);
              }else if(type == 2 || type == 3){
                this.synchright[index].option[key].treetop.forEach(item => {
                  data.push(this.synchright[item])
                });
                setTimeout(() => {
                  this.$nextTick(()=>{
                    data.forEach(row => {
                        this.$refs.multipleTable.toggleRowSelection(this.synchright.find(val => {
                        return row.uid == val.uid
                        }),true);
                    });
                  })
                }, 100);
              }
              this.assrebut = true;
            },

            //选择关联
            handleSelectionChange(val){
              this.zancunindex = [];
              this.zancunnum = [];
              val.forEach((val, index) => {
                this.synchright.forEach((v, i) => {
                    if(val.uid == v.uid){
                    this.zancunindex.push(i);
                    this.zancunnum.push(i+1);
                    }
                })
              }) 
            },

            //关联显示必填弹框关闭
            assmark(){
              this.zancunindex = [];
              this.zancunnum = [];
              this.assrebut = false;
            },

            //关联显示必填弹框确认
            asspost(){
              if(this.istyp == 1 || this.istyp == 4 || this.istyp == 5 || this.istyp == 6 || this.istyp == 7 || this.istyp == 8){
                if(this.synchright[this.glind].son.length > 0){
                  this.synchright[this.glind].son = this.zancunnum;
                  this.synchright[this.glind].treetop = this.zancunindex;
                }else{
                  this.synchright[this.glind].son = Array.from(new Set([...this.synchright[this.glind].son, ...this.zancunnum]));
                  this.synchright[this.glind].treetop = Array.from(new Set([...this.synchright[this.glind].treetop, ...this.zancunindex]));
                }
              }else if(this.istyp == 2 || this.istyp == 3){
                if(this.synchright[this.glind].option[this.iske].son.length > 0){
                  this.synchright[this.glind].option[this.iske].son = this.zancunnum;
                  this.synchright[this.glind].option[this.iske].treetop = this.zancunindex;
                }else{
                  this.synchright[this.glind].option[this.iske].son = Array.from(new Set([...this.synchright[this.glind].option[this.iske].son, ...this.zancunnum]));
                  this.synchright[this.glind].option[this.iske].treetop = Array.from(new Set([...this.synchright[this.glind].option[this.iske].treetop, ...this.zancunindex]));
                }
              }
              
              this.assrebut = false;
            },

            //选择的题目上移
            Moveup(index){
                if(index != 0){
                //题目更改
                if(this.synchright[index-1].type == 1 || this.synchright[index-1].type == 4 || this.synchright[index-1].type == 5 || this.synchright[index-1].type == 6 || this.synchright[index-1].type == 7 || this.synchright[index-1].type == 8){
                    this.synchright[index-1].treetop.forEach((item,i) => {
                    if(item == index){
                        this.synchright[index-1].treetop.splice(i,1)
                    }
                    })

                    this.synchright[index-1].son.forEach((item,i) => {
                    if(item == index+1){
                        this.synchright[index-1].son.splice(i,1)
                    }
                    })
                }


                //选项更改
                if(this.synchright[index-1].type == 2 || this.synchright[index-1].type == 3){
                    for(let v=0; v < this.synchright[index-1].option.length; v++){

                    this.synchright[index-1].option[v].treetop.forEach((item,n) => {
                        if(item == index){
                        this.synchright[index-1].option[v].treetop.splice(n,1)
                        }
                    })

                    this.synchright[index-1].option[v].son.forEach((item,i) => {
                        if(item == index+1){
                        this.synchright[index-1].option[v].son.splice(i,1)
                        }
                    })

                    }
                }
                
                for(let i=0; i< index; i++){
                    
                    if(this.synchright[i].type == 1 || this.synchright[i].type == 4 || this.synchright[i].type == 5 || this.synchright[i].type == 6 || this.synchright[i].type == 7 || this.synchright[i].type == 8){
                    if (this.synchright[i].son.includes(index+1) && this.synchright[i].son.includes(index)) {
                    
                    } else {
                        if(this.synchright[i].son.includes(index+1)){
                        let m = this.synchright[i].son.indexOf(index+1)
                        this.synchright[i].son.splice(m,1,index)
                        let n = this.synchright[i].treetop.indexOf(index)
                        this.synchright[i].treetop.splice(n,1,index-1)
                        }else if(this.synchright[i].son.includes(index)){
                        let m = this.synchright[i].son.indexOf(index)
                        this.synchright[i].son.splice(m,1,index+1)
                        let n = this.synchright[i].treetop.indexOf(index-1)
                        this.synchright[i].treetop.splice(n,1,index)
                        }
                    }
                    }else if(this.synchright[i].type == 2 || this.synchright[i].type == 3){
                    for(let p=0; p < this.synchright[i].option.length; p++){
                        if (this.synchright[i].option[p].son.includes(index+1) && this.synchright[i].option[p].son.includes(index)) {
                    
                        } else {
                        if(this.synchright[i].option[p].son.includes(index+1)){
                            let m = this.synchright[i].option[p].son.indexOf(index+1)
                            this.synchright[i].option[p].son.splice(m,1,index)
                            let n = this.synchright[i].option[p].treetop.indexOf(index)
                            this.synchright[i].option[p].treetop.splice(n,1,index-1)
                        }else if(this.synchright[i].option[p].son.includes(index)){
                            let m = this.synchright[i].option[p].son.indexOf(index)
                            this.synchright[i].option[p].son.splice(m,1,index+1)
                            let n = this.synchright[i].option[p].treetop.indexOf(index-1)
                            this.synchright[i].option[p].treetop.splice(n,1,index)
                        }
                        }
                    }
                    }
                }

                let arrnew = this.synchright;
                arrnew.splice(index - 1, 1, ...arrnew.splice(index, 1, arrnew[index - 1]));
                }
            },

            //选择的题目下移
            Movedown(index){
                
                //题目更改
                if(this.synchright[index].type == 1 || this.synchright[index].type == 4 || this.synchright[index].type == 5 || this.synchright[index].type == 6 || this.synchright[index].type == 7 || this.synchright[index].type == 8){
                this.synchright[index].treetop.forEach((item,i) => {
                    if(item == index+1){
                    this.synchright[index].treetop.splice(i,1)
                    }
                })

                this.synchright[index].son.forEach((item,i) => {
                    if(item == index+2){
                    this.synchright[index].son.splice(i,1)
                    }
                })
                }


                //选项更改
                if(this.synchright[index].type == 2 || this.synchright[index].type == 3){
                for(let v=0; v < this.synchright[index].option.length; v++){

                    this.synchright[index].option[v].treetop.forEach((item,n) => {
                    if(item == index+1){
                        this.synchright[index].option[v].treetop.splice(n,1)
                    }
                    })

                    this.synchright[index].option[v].son.forEach((item,i) => {
                    if(item == index+2){
                        this.synchright[index].option[v].son.splice(i,1)
                    }
                    })

                }
                }

                for(let i=0; i<= index; i++){
                if(this.synchright[i].type == 1 || this.synchright[i].type == 4 || this.synchright[i].type == 5 || this.synchright[i].type == 6 || this.synchright[i].type == 7 || this.synchright[i].type == 8){
                    if (this.synchright[i].son.includes(index+1) && this.synchright[i].son.includes(index+2)) {
                    
                    } else {
                    if(this.synchright[i].son.includes(index+1)){
                        let m = this.synchright[i].son.indexOf(index+1)
                        this.synchright[i].son.splice(m,1,index+2)
                        let n = this.synchright[i].treetop.indexOf(index)
                        this.synchright[i].treetop.splice(n,1,index+1)
                        
                    }else if(this.synchright[i].son.includes(index+2)){
                        let m = this.synchright[i].son.indexOf(index+2)
                        this.synchright[i].son.splice(m,1,index+1)
                        let n = this.synchright[i].treetop.indexOf(index+1)
                        this.synchright[i].treetop.splice(n,1,index)
                    }
                    }
                }else if(this.synchright[i].type == 2 || this.synchright[i].type == 3){
                    for(let p=0; p < this.synchright[i].option.length; p++){
                    if (this.synchright[i].option[p].son.includes(index+1) && this.synchright[i].option[p].son.includes(index+2)) {
                    
                    } else {
                        if(this.synchright[i].option[p].son.includes(index+1)){
                        let m = this.synchright[i].option[p].son.indexOf(index+1)
                        this.synchright[i].option[p].son.splice(m,1,index+2)
                        let n = this.synchright[i].option[p].treetop.indexOf(index)
                        this.synchright[i].option[p].treetop.splice(n,1,index+1)
                        }else if(this.synchright[i].option[p].son.includes(index+2)){
                        let m = this.synchright[i].option[p].son.indexOf(index+2)
                        this.synchright[i].option[p].son.splice(m,1,index+1)
                        let n = this.synchright[i].option[p].treetop.indexOf(index+1)
                        this.synchright[i].option[p].treetop.splice(n,1,index)
                        }
                    }
                    }
                }
                }
                let arrnew = this.synchright;
                arrnew.splice(index, 1, ...arrnew.splice(index + 1, 1, arrnew[index]));
            },

            //选择的题目置顶
            Ontop(index){
                if(index != 0){
                for(let i=0; i< index; i++){
                    if(this.synchright[i].type == 1 || this.synchright[i].type == 4 || this.synchright[i].type == 5 || this.synchright[i].type == 6 || this.synchright[i].type == 7 || this.synchright[i].type == 8){
                    if (this.synchright[i].son.includes(index+1)) {
                        let m = this.synchright[i].son.indexOf(index+1)
                        this.synchright[i].son.splice(m,1)
                        let n = this.synchright[i].treetop.indexOf(index)
                        this.synchright[i].treetop.splice(n,1)

                        this.synchright[i].son = this.synchright[i].son.map(item => item< index+1?item+1:item);
                        this.synchright[i].treetop = this.synchright[i].treetop.map(item => item< index?item+1:item)
                    }
                    }else if(this.synchright[i].type == 2 || this.synchright[i].type == 3){
                    for(let p=0; p < this.synchright[i].option.length; p++){
                        if (this.synchright[i].option[p].son.includes(index+1)) {
                        let m = this.synchright[i].option[p].son.indexOf(index+1)
                        this.synchright[i].option[p].son.splice(m,1)
                        let n = this.synchright[i].option[p].treetop.indexOf(index)
                        this.synchright[i].option[p].treetop.splice(n,1)

                        this.synchright[i].option[p].son = this.synchright[i].option[p].son.map(item => item< index+1?item+1:item);
                        this.synchright[i].option[p].treetop = this.synchright[i].option[p].treetop.map(item => item< index?item+1:item)
                        }
                    }
                    }
                }

                let arrnew = this.synchright;
                arrnew.unshift(arrnew.splice(index, 1)[0]);
                }
            },

            //删除选择的题目
            dellist(index){
                // for(let i=0; i< this.synchright.length; i++){
                //   console.log(this.synchright[i].type)
                
                //   if(this.synchright[i].type == 1 || this.synchright[i].type == 4 || this.synchright[i].type == 5 || this.synchright[i].type == 6 || this.synchright[i].type == 7 || this.synchright[i].type == 8){
                //       if (this.synchright[i].son.includes(index+1)) {
                //       let m = this.synchright[i].son.indexOf(index+1)
                //       this.synchright[i].son.splice(m,1)
                //       let n = this.synchright[i].treetop.indexOf(index)
                //       this.synchright[i].treetop.splice(n,1)
                //       }

                //       this.synchright[i].son = this.synchright[i].son.map(item => item > index+1?item-1:item);
                //       this.synchright[i].treetop = this.synchright[i].treetop.map(item => item > index?item+1:item)
                //   }else if(this.synchright[i].type == 2 || this.synchright[i].type == 3){
                //       for(let p=0; p < this.synchright[i].option.length; p++){
                //       if (this.synchright[i].option[p].son.includes(index+1)) {
                //           let m = this.synchright[i].option[p].son.indexOf(index+1)
                //           this.synchright[i].option[p].son.splice(m,1)
                //           let n = this.synchright[i].option[p].treetop.indexOf(index)
                //           this.synchright[i].option[p].treetop.splice(n,1)
                //       }

                //       this.synchright[i].option[p].son = this.synchright[i].option[p].son.map(item => item > index+1?item-1:item);
                //       this.synchright[i].option[p].treetop = this.synchright[i].option[p].treetop.map(item => item > index?item-1:item)
                //       }
                //   }
                // }
                
                
                this.$nextTick(() => {
                  let centnew = this.synchright;
                  this.avite = 'null';
                  this.sztype = 'null';
                  centnew.splice(index,1);
                });
                
            },

            //问答数据验证
            wenda(event,index){
                delete this.synchright[index].numb_unit;
                delete this.synchright[index].check_unit;
                delete this.synchright[index].check_number_length;
                delete this.synchright[index].check_number_type;
                delete this.synchright[index].check_number_end;
                delete this.synchright[index].check_string_begin;
                delete this.synchright[index].check_string_end;
                delete this.synchright[index].check_string_length;
                delete this.synchright[index].decimal_end;
                if(event ==  2){
                this.synchright[index]['check_string_length'] = 1;
                }else if(event ==  3){
                this.synchright[index]['numb_unit'] = 'null';
                this.synchright[index]['check_unit'] = 'null';
                this.synchright[index]['check_number_type'] = 1;
                this.synchright[index]['check_number_length'] = 1;
                this.synchright[index]['check_string_length'] = 1;
                }else if(event ==  11){
                this.synchright[index]['check_number_length'] = 1;
                this.synchright[index]['decimal_end'] = '2';
                }
            },

            //问答二级数据验证
            wderji(event,index){
                if(event == 8 || event == 9){
                this.synchright[index]['check_string_length'] = event;
                this.synchright[index]['check_string_end'] = '100';
                }
                this.$forceUpdate();
            },

            //问答选择数值单位
            wdnumber(event,index){
                if(event != '自定义'){
                this.synchright[index]['check_unit'] = event;
                }
                this.$forceUpdate();
            },

            //问答清除
            wdqingc(){
                this.$forceUpdate();
            },

            //多选数据验证
            duoxuan(event,index){
                if(event == 1){
                delete this.synchright[index].check_number_end;
                }else{
                this.synchright[index]['check_number_end'] = '1';
                }
            },
            
            //发布
            confirm(){
              if(!this.alldata.name){
                ElMessage({
                  message: '请输入表单名称',
                  type: 'error',
                });
                return
              }

              let newarr = [];
              for(let i= 0; i< this.synchright.length; i++){
                if(!this.synchright[i].name){
                  ElMessage({
                    message: '您还有未填写的问题标题',
                    type: 'error',
                  });
                  return
                }
                
                if(this.synchright[i].type == '2' || this.synchright[i].type == '3'){
                  for(let m = 0; m < this.synchright[i].option.length; m++){
                    newarr.push(...this.synchright[i].option[m].treetop)
                  }
                }else{
                  newarr.push(...this.synchright[i].treetop);
                }
              }
                
              this.alldata['association'] = newarr;
              this.alldata.question = this.synchright;
              this.alldata.create_user_id = this.alldata.que_id;
              
              axios.post('http://api.customer.form.bailingkeji.com/admin/investigate/update',this.alldata,{
                  headers: {
                    'Authorization': 'Bearer ' + this.token
                  }
              }).then((res)=>{
                if(res.data.code == 0){
                  axios.post('http://api.customer.form.bailingkeji.com/admin/questionnaire/clone',{
                    questionnaire_id: this.alldata.que_id,
                    obj_id: this.alldata.que_id,
                    create_user_id: this.alldata.que_id
                  },{
                      headers: {
                      'Authorization': 'Bearer ' + this.token
                      }
                  }).then((msg)=>{
                    if(msg.data.code == 0){
                      ElMessage({
                        message: msg.data.msg,
                        type: 'success',
                      });
                      setTimeout(() => {
                        this.alldata = {
                          name: '',
                          que_type: 1,
                          question:[],
                          status: 1
                        }
                        this.isshow = 1;
                      }, 1800);
                      
                    }else{
                      ElMessage({
                        message: msg.data.msg,
                        type: 'error',
                      });
                    }
                  })
                }else{
                  ElMessage({
                    message: res.data.msg,
                    type: 'error',
                  });
                }
              })
            },

            onEditorBlur(val) {  //编辑器失去焦点事件
              
            },
            onEditorFocus() { //编辑器获得焦点事件
                
            },
            onEditorChange(e,index) { //编辑器内容改变事件
              this.$emit("input", this.synchright[index].content);
            },

        },
    }
</script>

<style lang="scss" scoped>
:deep(.cell){
    color:#5e6d82 ;
    font-size: 13px;
}
:deep(thead){
    .cell{
        color:#1f2f3d ;
        font-size: 14px;
        font-weight: 650;
    }
}
:deep(.row_name){
   height: 42px !important;
}
:deep(.el-table__cell){
    padding: 0;
}
.Cousee-bianji{
    position: absolute;
    top: 0;
    left: 0;
    background: #fff;
    width: calc(100vw - 200px);
    z-index: 999;
    padding: 20px;
}
.Coursee-goback{
    width: 36px;
    height: 36px;
    background: url(../../../public/images/fanhui.png) center no-repeat #f0f0f0;
    border-radius: 50px;
    cursor: pointer;
  }
  .Coursee-goback:hover{
    color: #000;
  }
  .Invbuild{
    display: flex;
  }
  .Invbuild-left{
    width: 70%;
    height: 80vh;
    overflow: hidden;
    position: relative;
  }
  
  .Invbuild-gcent{
    overflow-y: auto;
    height: 100%;
  }

  .Invbuild-gcent::-webkit-scrollbar {
    width: 1px;
  }
  .Invbuild-gcent::-webkit-scrollbar-track {
    background-color: #f1f1f1;
    opacity: 0.2;
  }
  .Invbuild-gcent::-webkit-scrollbar-thumb {
    background-color: #888;
    border-radius: 5px;
  }
  .Invbuild-gcent::-webkit-scrollbar-thumb:hover {
    background-color: #555;
  }

  .insertques{
    width: 61%;
    height: 100px;
    border-top: 1px solid #eee;
    position: fixed;
    bottom: 0;
    left: 200px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    background: #fff;
    z-index: 2;
  }
  .insertques-left{
    flex: 1;
    margin-left: 20px;
  }
  .insertques-title{
    font-size: 14px;
    color: #333;
  }
  .insertques-sp{
    display: flex;
    justify-content: space-between;
    margin-top: 10px;
  }
  .insertques-sp span{
    width: 10%;
    height: 50px;
    background-color: rgba(245, 245, 245, 1);
    border-radius: 6px;
    font-size: 12px;
    display: flex;
    align-items: flex-end;
    justify-content: center;
    padding-bottom: 5px;
    cursor: pointer;
  }
  .inser-wd{
    background: url(../../../public/images/wenda.png) center 10px no-repeat;
    background-size: 16px 16px;
  }
  .inser-danx{
    background: url(../../../public/images/danxuan.png) center 10px no-repeat;
    background-size: 16px 16px;
  }
  .inser-duox{
    background: url(../../../public/images/duoxuan.png) center 10px no-repeat;
    background-size: 16px 16px;
  }
  .inser-rq{
    background: url(../../../public/images/riqi.png) center 10px no-repeat;
    background-size: 16px 16px;
  }
  .inser-sj{
    background: url(../../../public/images/shijian.png) center 10px no-repeat;
    background-size: 16px 16px;
  }
  .inser-sc{
    background: url(../../../public/images/shichang.png) center 10px no-repeat;
    background-size: 16px 16px;
  }
  .inser-tp{
    background: url(../../../public/images/tupian.png) center 10px no-repeat;
    background-size: 16px 16px;
  }
  .inser-wj{
    background: url(../../../public/images/wenjian.png) center 10px no-repeat;
    background-size: 16px 16px;
  }

  .insertques-tiku{
    width: 80px;
    height: 50px;
    background: url(../../../public/images/tkdr.png) center 10px no-repeat;
    background-size: 16px 16px;
    background-color: rgba(245, 245, 245, 1);
    border-radius: 6px;
    font-size: 12px;
    display: flex;
    align-items: flex-end;
    justify-content: center;
    padding-bottom: 5px;
    cursor: pointer;
    display: flex;
    justify-content: center;
    margin-top: 10px;
  }

  .Invbuild-zhong{
    width: 20px;
    height: 84vh;
    background: #f5f5f5;
  }
  .Invbuild-right{
    margin-left: 30px;
    padding-top: 10px;
  }
  .Build-box{
    background: #fff;
    padding-bottom: 30px;
  }
  .Build-info{
    margin: 0 40px;
  }
  .Build-name{
    font-size: 14px;
    color: #646464;
    margin-bottom: 8px;
  }
  .Build-quesbox{
    display: flex;
    background: #f5f5f5;
    padding: 20px;
    border-radius: 8px;
    margin-bottom: 18px;
  }
  .Build-on{
    box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.2)
  }
  .Build-treetop{
    font-size: 14px;
    margin-right: 20px;
    line-height: 30px;
  }
  .Build-inright{
    flex: 1;
  }
  .Build-intitle{
    width: 100%;
    border-bottom: 1px solid #d9d9d9;
  }
  ::v-deep .Build-intitle .el-input__inner{
    border: none !important;
    line-height: 30px !important;
    height: 30px !important;
  }
  .Build-incomp{
    width: 100%;
    display: flex;
    position: relative;
    flex-direction: row-reverse;
  }
  ::v-deep .Build-incomp .el-textarea__inner{
    width: 97%;
    border: none !important;
    max-height: 60px !important;
    background: #f5f5f5;
  }
  .Build-incomp img{
    margin-top: 6px;
    width: 20px;
    height: 20px;
  }
  .Build-botom{
    display: flex;
    justify-content: space-between;
    margin-top: 10px;
  }
  .Build-botleft{
    display: flex;
    justify-content: space-between;
    align-items: center;
  }
  .Build-botleft div{
    text-align: center;
    margin-right: 20px;
  }
  ::v-deep .Build-botleft .el-checkbox__label{
    font-size: 12px !important;
  }
  .Build-gtixing{
    font-size: 12px;
    color: #606266;
    font-weight: 500;
  }
  .Build-guanl{
    font-size: 12px;
    color: #606266;
    font-weight: 500;
  }
  .Build-guanl span{
    color: blue;
    cursor: pointer;
  }

  .Build-list{
    margin-top: 20px;
  }
  .Courselist-So{
    display: flex;
    align-items: center;
    margin: 10px 0;
  }
  .Courselist-search{
    display: flex;
  }
  .Courselist-serinp{
    display: flex;
    align-items: center;
    margin-right:20px
  }
  .Courselist-kctit{
    width: 44px;
  }
  .Ad-title{
    width: 60px;
  }
  .Courselist-serinp label{
    display: inline-block;
    font-size: 14px;
    color: #310b2b;
    padding: 5px 4px;
    margin-right: 10px;
  }
  .Courselist-search input::-webkit-input-placeholder { /* WebKit, Blink, Edge */
    color:#c3c4c7;
  }
  .Courselist-search input:-moz-placeholder { /* Mozilla Firefox 4 to 18 */
    color:#c3c4c7;
  }
  .Courselist-search input::-moz-placeholder { /* Mozilla Firefox 19+ */
    color:#c3c4c7;
  }
  .Courselist-search input:-ms-input-placeholder { /* Internet Explorer 10-11 */
    color:#c3c4c7;
  }
  .Build-radio .el-radio{
    width: 110px;
    margin-right: 0;
  }
  .Build-ok{
    background: #fff;
    padding: 20px 0;
    margin: 0 30px 40px;
  }
  .Build-isbut{
    width: 500px;
    text-align: center;
    font-size: 14px;
    margin: 0 auto;
    line-height: 40px;
    background: #0004fd;
    cursor: pointer;
    color: #fff;
  }
  .mt30{
    margin-top: 30px;
  }
  ::v-deep .el-textarea__inner{
    resize: none;
  }
  
  .Trainclass-but{
    display: flex;
  }
  .Trainclass-query{
    width: 38px;
    height: 38px;
    border: 1px solid #ededed;
    text-align: center;
    cursor: pointer;
    border-radius: 5px;
    background: url(../../../public/images/souo.png) center no-repeat;
    background-size:16px 16px;
    margin-right: 10px;
  }
  .Trainclass-reset{
    width: 38px;
    height: 38px;
    border: 1px solid #ededed;
    text-align: center;
    cursor: pointer;
    border-radius: 5px;
    background: url(../../../public/images/chongzhi.png) center no-repeat;
    background-size:16px 16px;
    margin-right: 10px;
  }
  .examine-mark{
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.6);
    z-index: 999;
  }
  .operate-tck{
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
    z-index: 999;
  }
  .mend-box{
    width: 1000px;
    height: 100%;
    background: #fff;
    border-radius: 10px;
  }
  .operate-box{
    width: 500px;
    background: #fff;
    border-radius: 10px;
  }
  .operate-top{
    position: relative;
    background: #e5e5ff;
    border-radius: 10px 10px 0 0;
    padding-bottom: 10px;
  }
  .operate-logo{
    position: absolute;
    top: -25px;
    left: 50%;
    transform: translate(-50%);
    width: 52px;
    height: 52px;
    border-radius: 50%;
    box-shadow: 0px 0px 3px 2px rgba(0, 0, 0, .1);
    background: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
  }
  .operate-logo img{
    width: 18px;
    height: 18px;
  }
  .operate-zhong{
    max-height: 454px;
    margin: 10px 20px;
    overflow: auto;
  }
  .operate-checlist{
    border-bottom: 1px solid #d8d8d8;
    padding: 20px 0;
  }
  .newgl-czwc{
    font-size: 18px;
    color: #3738ff;
    font-weight: bold;
    text-align: center;
    padding-top: 36px;
  }
  .operate-czwc{
    font-size: 18px;
    color: #3738ff;
    font-weight: bold;
    text-align: center;
    padding-top: 36px;
  }
  .examine-but{
    width: 100%;
    border-top: 1px solid #dcdcdc;
    background: #f5f5f5;
    display: flex;
    align-items: center;
    line-height: 42px;
    border-radius: 0 0 10px 10px;
    margin-top: 44px;
  }
  .examine-close{
    font-size: 14px;
    font-weight: 0;
    background: url(../../../public/images/qx.png) 210px center no-repeat;
    padding-left: 230px;
    padding-right: 85px;
    cursor: pointer;
    flex: 1;
    color: #969696;
  }
  .examine-close:hover{
    color: #000;
    background: url(../../../public/images/qxxz.png) 210px center no-repeat;
  }
  .examine-xian{
    width: 1px;
    height: 16px;
    background: #c8c8c8;
  }
  .examine-gonin{
    font-size: 14px;
    font-weight: 0;
    background: url(../../../public/images/qr.png) 210px center no-repeat;
    background-size: 10px 10px;
    padding-left: 230px;
    padding-right: 79px;
    flex: 1;
    cursor: pointer;
    color: #969696;
  }
  .examine-gonin:hover{
    color: #3738ff;
    background: url(../../../public/images/qrxz.png) 210px center no-repeat;
    background-size: 10px 10px;
  }
  .newgl-but{
    width: 100%;
    border-top: 1px solid #dcdcdc;
    background: #f5f5f5;
    display: flex;
    align-items: center;
    line-height: 42px;
    border-radius: 0 0 10px 10px;
    margin-top: 44px;
  }
  .newgl-close{
    font-size: 14px;
    font-weight: 0;
    background: url(../../../public/images/qx.png) 90px center no-repeat;
    padding-left: 110px;
    padding-right: 85px;
    cursor: pointer;
    flex: 1;
    color: #969696;
  }
  .newgl-close:hover{
    color: #000;
    background: url(../../../public/images/qxxz.png) 90px center no-repeat;
  }
  .newgl-xian{
    width: 1px;
    height: 16px;
    background: #c8c8c8;
  }
  .newgl-gonin{
    font-size: 14px;
    font-weight: 0;
    background: url(../../../public/images/qr.png) 90px center no-repeat;
    background-size: 10px 10px;
    padding-left: 110px;
    padding-right: 79px;
    flex: 1;
    cursor: pointer;
    color: #969696;
  }
  .newgl-gonin:hover{
    color: #3738ff;
    background: url(../../../public/images/qrxz.png) 90px center no-repeat;
    background-size: 10px 10px;
  }
  .Build-selebut{
    width: 80px;
    height: 37px;
    background: url(../../../public/images/cjtj.png) 30px center no-repeat #0004fd;
    background-size: 11px 11px;
    border: 1px solid #0004fd;
    font-size: 12px;
    color: #fff;
    padding-left: 48px;
    line-height: 38px;
    cursor: pointer;
    border-radius: 5px;
  }
  .Build-selebox{
    padding: 10px 0;
    border: 1px solid #DCDFE6;
    border-radius: 5px;
    margin-top: 20px;
    max-height: 500px;
    overflow: auto;
  }
  .quertion-list{
    margin: 13px 16px;
    display: flex;
    align-items: flex-start;
  }
  .querlist-left{
    display: flex;
    align-items: center;
  }
  .querlist-name{
    width: 52px;
    height: 16px;
    background: #fff;
    border: 1px solid #969696;
    font-size: 12px;
    color: #000;
    text-align: center;
    border-radius: 0 18px 18px 0;
    line-height: 16px;
  }
  .querlist-right{
    margin:0 30px 0 10px;
    width: 100%;

  }
  .querlist-evetitle{
    font-size: 12px;
    color: #8b8b8b;
    line-height: 20px;
    display: flex;
    justify-content: space-between;
  }
  .querlist-newname{
    width: 80%;
    word-break: break-word;
  }
  .querlist-pic img{
    width: 16px;
    height: 16px;
    margin-right: 10px;
    cursor: pointer;
  }

  .querlist-radio .el-radio{
    display: block;
    font-size: 12px;
    margin-top: 7px;
    color:#8b8b8b;
  }
  ::v-deep .querlist-radio .el-radio__label{
    color:#8b8b8b !important;
  }
  ::v-deep .querlist-radio .is-checked .el-radio__label{
    color: #000 !important;
  }
  ::v-deep .querlist-radio .is-checked .el-radio__inner{
    background: #fff !important;
    border: 1px solid #409EFF !important;
  }
  ::v-deep .querlist-radio .is-checked .el-radio__inner::after{
    background: #409EFF !important;
  }
  .querlist-radio .el-checkbox{
    display: block;
    font-size: 12px;
    margin-top: 7px;
    color:#8b8b8b;
  }
  ::v-deep .querlist-radio .el-checkbox__label{
    color:#8b8b8b !important;
  }
  ::v-deep .querlist-radio .is-checked .el-checkbox__label{
    color: #000 !important;
  }
  ::v-deep .querlist-radio .is-checked .el-checkbox__inner{
    background: #fff !important;
    border: 1px solid #409EFF !important;
  }
  ::v-deep .querlist-radio .is-checked .el-checkbox__input.is-disabled.is-checked .el-checkbox__inner::after{
    border-color: #409EFF !important;
  }
  .applyfor-topthree{
    display: flex;
    align-items: center;
    padding: 10px 0 0;
  }
  .applyfor-topthree:last-child{
    border-bottom: none;
  }
  .applyfor-topthree p{
    font-size: 12px;
    width: 244px;
    color: #000;
  }
  .applyfor-topthree p span{
    display: inline-block;
    width: 70px;
    text-align: right;
    color: #8b8b8b;
  }
  .querlist-naireask{
    display: flex;
    align-items: flex-start;
    line-height: 16px;
    font-size: 12px;
    color: #8b8b8b;
  }
  .querlist-naireask p{
    font-size: 12px;
    color: #000;
    margin-right: 50px;
  }
  .querlist-naireask p span{
    display: inline-block;
    width: 70px;
    text-align: right;
    color: #8b8b8b;
  }
  .querlist-naireask p i{
    font-style: normal;
    color: #0004fd;
    cursor: pointer;
  }
  .querlist-probox{
    display: flex;
    align-items: center;
    margin-top: 8px;
  }
  .querlist-protitle{
    color: #8b8b8b;
    width: 600px;
    font-size: 12px;
  }
  .querlist-proress{
    font-size: 12px;
    color: #8b8b8b;
    display: flex;
  }
  .querlist-proress p{
    margin: 0 20px;
  }
  .querlist-proress span{
    display: inline-block;
    width: 70px;
    text-align: right;
    color: #8b8b8b;
  }

  .querlist-proress p i{
    font-style: normal;
    color: #0004fd;
    cursor: pointer;
  }

  .Add-sele{
    width: 63px;
  }
  ::v-deep .Add-sele .el-input__inner{
    border: none;
    height: auto;
    line-height: normal;
    font-size: 12px;
  }
  ::v-deep .Add-sele .el-input__suffix{
    top: 12px;
  }

  ::v-deep .operate-zhong .el-input__icon{
    line-height: 47px;
  }

  .ationDom{
    width: 345px !important;
  }
  .Build-xianx{
    margin-top: 10px;
  }
  
  .Build-option{
    display: flex;
  }
  ::v-deep .Build-option .el-input__inner{
    // background: #f5f5f5;
  }
  .Trainclass-del{
    width: 38px;
    height: 38px;
    border: 1px solid #ededed;
    text-align: center;
    cursor: pointer;
    border-radius: 5px;
    background: url(../../../public/images/sckc.png) center no-repeat;
    background-size:16px 16px;
  }
  .Trainclass-del:hover{
    border: 1px solid #0004fd;
  }
  .Trainclass-zhanwei{
    width: 38px;
    height: 38px;
  }
  .Createsub{
    margin-top: 20px;
  }
  .Createsub span{
    display: block;
    width: 88px;
    height: 34px;
    line-height: 34px;
    border: 1px solid #0004fd;
    border-radius: 6px;
    background: url(../../../public/images/cjtj.png) 30px center no-repeat #0004fd;
    background-size: 11px 11px;
    font-size: 14px;
    color: #fff;
    padding-left: 48px;
    cursor: pointer;
    margin: 0 auto;
  }
  .Build-optguanl{
    font-size: 12px;
    color: #606266;
    font-weight: 500;
    margin-top: 5px;
    margin-left: 40px;
  }
  .Build-optguanl span{
    color: blue;
    cursor: pointer;
    margin-right: 20px;
  }
  .Build-guding{
    border: 1px solid #d8d8d8;
    padding: 10px;
    font-size: 12px;
    color: #666;
    border-radius: 5px;
    width: 200px;
  }
  .Build-guding input{
    border: none;
    margin: 0 6px;
    outline: none;
    text-align: center;
  }
  .Build-ywz{
    border: 1px solid #d8d8d8;
    padding: 10px;
    font-size: 12px;
    color: #666;
    border-radius: 5px;
    width: 200px;
  }
  .Build-ywz input{
    width: 110px;
    border: none;
    margin: 0 6px;
    outline: none;
    text-align: center;
  }
  .Build-jieyu{
    display: flex;
    align-items: center;
  }
  .Build-jieyu span{
    margin: 0 6px;
    font-size: 14px;
  }
  .Build-jieyu input{
    -webkit-appearance: none;
    background-color: #FFF;
    background-image: none;
    border-radius: 4px;
    border: 1px solid #DCDFE6;
    box-sizing: border-box;
    color: #606266;
    display: inline-block;
    height: 40px;
    line-height: 40px;
    outline: 0;
    padding: 0 15px;
    transition: border-color .2s cubic-bezier(.645,.045,.355,1);
    width: 140px;
  }
  .Build-mt20{
    margin-top: 20px;
  }
  .Build-zhuyi{
    margin-top: 20px;
    font-size: 12px;
    color: #999;
  }
  ::v-deep .Build-incomp .quill-editor{
    display: flex;
    flex-direction: row-reverse;
    width: 100%;
  }
  ::v-deep .Build-incomp .ql-editor.ql-blank::before{
    color: #c8c8c8;
  }
  ::v-deep .Build-incomp .ql-editor img{
    max-width: 140px;
  }
  ::v-deep .Build-incomp .ql-toolbar.ql-snow{
    border: none;
  }
  ::v-deep .Build-incomp .ql-container{
    flex: 1;
  }
  ::v-deep .Build-incomp .ql-container.ql-snow{
    border: none;
  }

  .uploadImgEditor{
    opacity: 0;
    margin-left: 10px;
    width: 26px;
  }
  ::v-deep .el-form{
    position: absolute;
    right: 25px;
    height: 0;
  }
  .Seerate-box{
    width: 970px;
    height: 100%;
    background: #fff;
    border-radius: 10px;
  }
  .Seecour-zhong{
    max-height: 500px;
    padding: 20px 30px;
    overflow: auto;
  }
  .applyfor-topfour{
    display: flex;
    align-items: center;
    padding-bottom: 16px;
    border-bottom: 1px solid #d0d0d0;
  }
  .applyfor-topfour p{
    font-size: 12px;
    width: 244px;
    color: #000;
  }
  .applyfor-topfour p span{
    display: inline-block;
    width: 70px;
    text-align: right;
    color: #8b8b8b;
  }
  .applyfor-illustrate{
    font-size: 12px;
    color: #000;
    margin-top: 16px;
  }
  .applyfor-illustrate span{
    display: inline-block;
    width: 70px;
    text-align: right;
    color: #8b8b8b;
  }
  .applyfor-questitle{
    background: #e6e6e6;
    border-radius: 18px;
    padding: 4px 0 6px 4px;
    margin-top: 17px;
  }
  .applyfor-questitle span{
    font-size: 12px;
    color: #000;
    background: #fff;
    border-radius: 18px;
    padding: 4px 25px;
  }
  .querlist-tep{
    width: 38px;
    height: 18px;
    background: #969696;
    font-size: 12px;
    color: #fff;
    text-align: center;
    border-radius: 18px 0 0 18px;
    line-height: 18px;
  }
  .Seecour-close{
    font-size: 14px;
    font-weight: 0;
    background: url(../../../public/images/qx.png) 456px center no-repeat #f5f5f5;
    cursor: pointer;
    color: #969696;
    flex: 1;
    text-align: center;
    line-height: 38px;
    border-radius: 0 0 10px 10px;
    border-top: 1px solid #d0d0d0;
  }
  .Seecour-close:hover{
    color: #000;
    background: url(../../../public/images/qxxz.png) 456px center no-repeat #f5f5f5;
  }
  .certifi-list{
    display: flex;
    margin-right: 20px;
    font-size: 12px;
    color: #000;
    margin-top: 0;
  }
  .certifi-list span{
    display: inline-block;
    width: 70px;
    color: #8b8b8b;
    text-align: right;
    margin-right: 5px;
    line-height: 22px;
  }
  .certifi-simbox{
    display: flex;
    flex-wrap: wrap;
    align-items: center;
  }
  .certifi-simtab{
    display: flex;
    align-items: center;
    margin-right: 16px;
    flex: 0 0 0 10px;
  }
  .certifi-info{
    flex: 1;
    line-height: 22px;
  }
  .certifi-info b{
    display: block;
    font-weight: normal;
  }
  ::v-deep .certifi-p p{
    margin: 0 !important;
  }

  .certifi-info i{
    font-style: normal;
  }
</style>
  